const box = document.querySelector('.hot ul');

function showCommoditys(id) {
    const commoditys = JSON.parse(localStorage.getItem('commoditys'))
    let li = document.createElement("li")
    li.setAttribute('data_id', id)
    li.innerHTML = `
        <img src="${commoditys[id-1].image}">
        <h4 class="name">${commoditys[id-1].name}</h4>
        <p class="price">￥${(commoditys[id-1].price).toFixed(2)}</p>
        <button>查看详情页</button>
        `
    box.appendChild(li)
}
showCommoditys(1)
showCommoditys(2)
showCommoditys(3)
showCommoditys(4)
showCommoditys(5)
showCommoditys(6)

box.addEventListener('click', function(e) {
    if (e.target.parentNode.nodeName === 'LI') {
        let id = e.target.parentNode.getAttribute('data_id');
        localStorage.setItem('data_id', id);
        location.href = 'detail.html';
    }
})